<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<div id="categoriesForm">

	<h2>
		<c:choose>
			<c:when test="${not empty categoryBean.id}"><fmt:message key="header.editCategory"/></c:when>
			<c:otherwise><fmt:message key="header.addCategory"/></c:otherwise>
		</c:choose>
	</h2>

	<form:form modelAttribute="categoryBean">
		<div class="name_holder">
			<fmt:message key="site.name"/>:
			<form:input path="name"/>
		</div>
		
		<div class="cols_holder">
			<div class="left_col">
				<div>
					<label class="title"><fmt:message key="site.currentCategoryItems"/>:</label>
				</div>
				<div class="items_holder">
					<form:select path="itemIds" multiple="multiple">
						<c:if test="${not empty categoryBean.items}">
							<c:forEach var="item" items="${categoryBean.items}">
								<option value="${item.id}">${item.name}</option>
							</c:forEach>
						</c:if>
					</form:select>
				</div>
			</div>
			
			<div class="middle_col">
				<div>
					<img src="<c:url value="/images/buttons/arrows_left_btn.PNG"/>" onclick="moveSelectedElements('allItems', 'itemIds')"/>
				</div>
				<div class="btn_holder">
					<img src="<c:url value="/images/buttons/arrows_right_btn.PNG"/>" onclick="moveSelectedElements('itemIds', 'allItems')"/>
				</div>
			</div>
			
			<div class="right_col">
				<div>
					<label class="title"><fmt:message key="site.availableItems"/>:</label>
				</div>
				<div class="items_holder">
					<select id="allItems" multiple="multiple">
						<c:if test="${not empty availableItems}">
							<c:forEach var="item" items="${availableItems}">
								<option value="${item.id}">${item.name}</option>
							</c:forEach>
						</c:if>
					</select>
				</div>
			</div>
		</div>
		
		<div class="btn_row">
			<input type="image" name="_eventId_save" value="<fmt:message key="button.save"/>" src="<c:url value="/images/buttons/save_btn.PNG"/>" onclick="selectListElements('itemIds')"/>
			<input type="image" name="_eventId_cancel" value="<fmt:message key="button.cancel"/>" src="<c:url value="/images/buttons/cancel_btn.PNG"/>" class="margin_left_btn"/>
		</div>
	</form:form>
</div>